<template>
	<div class='student'>
		<h3>人员信息展示</h3>
		<hr/>
		<ul>
			<li>{{name}}</li>
			<li>{{age}}</li>
			<li>{{msg}}</li>
			<li>{{money}}</li>
			<li>{{car.name}}</li>
			<li>{{car.age}}</li>
		</ul>
		<!-- 非特定情况下 可以使用修改父组件对象的属性,但是不能彻底修改整个对象 -->
		<button @click="car.name='宝马'">更改汽车品牌</button>
		<button @click="car.age=5">更改汽车年龄</button>
	</div>
</template>

<script>
	export default {
		name: 'Student',
		props:['msg','money','car'],
		data() {
			return {
				name:'小奶牛',
				age: 5,
			}
		}
	}
</script>

<style scoped>
	.student{
		background-color: pink;
		padding: 30px;
	}
</style>